How to create a Lesson using the Click to reveal Images Component?

When you use this component, you can place 2 images in circular borders. When user clicks any of these images, they will see the person’s question on the right side of the image along with another person’s image and answer for the question.

When to use this Component

You can use this component to create pages where you want to present two important questions in your lessons with tiny images in an interactive manner. Since the questions and answers are revealed when the relevant image is clicked, the students can easily understand and memorize the contents.

How it works

  1. The description text is provided on the top of the page.

  2. The user clicks on an image to reveal the related question and relevant answer.

  3. Feedback for the answer is displayed in a grey area below the answer.

  4. Click another image to reveal the related question, answer and feedback.

Features of this Component

  • The images are displayed in a circular border.

  • You can place an optional heading for the page.

  • You can add feedbacks at the bottom for each question and answer.

You can create a page using this component by following the below steps.

Step 1: Go to the required Slide

If you are creating a new Presentation, you will be taken to the first slide where you can use this component and create a page. Alternatively, if you want to add a new slide where you want to use this component, click on the '+' icon on the lower right corner as shown in the above image.

Step 2: Click on the Click to reveal Images Component Icon

Then click on the Click to reveal Images component icon as shown in the above image. You will see a screen similar to the image shown below.

On this screen, you can

  • Add an optional title by typing it in the Title [1] field.

  • Add the description text or contents on the Description [2] fields. These contents will appear on the top of the images.

  • Add First Questioner's Image [3] which will appear in circular border.

  • Add the first question in the First Question [4] field.

  • Add First Answerer's Image [5] which will appear in circular border.

  • Add the first answer in the First Answer [6] field.

  • Add the feedback for the first question and answer in the First Feedback [7] field.

  • Add the Second Questioner's Image, Second Answerer's Image, Second Question, Second Answer and Second Feedback [8] in the respective fields in the same way.

  • Save the changes by clicking the Done [9] button.

  • Click the Remove [10] button to remove this component from the page.

Step 3: Add a Title (Optional)

Type the title of the page on the Title field as shown in the above image. You can also change the format of the title. This field is not mandatory, and if you don't enter a title, it won't be shown as an empty space on the page.

Step 4: Add Description

Just type the contents of the page in the Description field as shown in the above image. You can also change the format of the text, add and remove hyperlinks and insert horizontal lines between the contents.

Step 5: Add First Questioner's Image

Click on the '+' button under the First Questioner's Image title shown above. You will get a screen similar to the one shown in the below image.

On the above screen, select the required image [1] and click the Open [2] button. You can see image being uploaded as shown in the below image.

Once the image has been uploaded, it will be shown under the First Questioner's Image title as shown [1] in the below image.

Optionally, you can update the copyright details of the uploaded image by clicking the Edit copyright [2] button shown above. Once you click the button, you will see the below screen.

You can enter the image's copyright details on the above screen and click the Close button to update it. You can remove the uploaded image by clicking on the Remove file button shown on the below image.

You will be prompted to remove the image as shown in the below image. Click OK to confirm and remove the image.

You can also update the image without removing it by clicking on the image. You will be offered to select the image again as mentioned in step 5.

Step 6: Add First Question

In the First Question field, add the first question text which should appear when the user clicks on the first questioner’s image. This field is mandatory as well. You can also change the format of the text, add and remove hyperlinks and insert horizontal lines between the contents.

Step 7: Add First Answerer’s Image

Repeat step 5 to add the image to the First Answerer’s Image field. After adding the image, you can see the first Answerer's image shown above.

Step 8: Add First Answer

In the First Answer field, add the first answer text which should appear when the user clicks on the first answerer’s image. This field is mandatory as well. You can also change the format of the text, add and remove hyperlinks and insert horizontal lines between the contents

Step 9: Add First Feedback

In the First Feedback field, add the first feedback text which should appear when the user clicks on the first image. This field is mandatory as well. You can also change the format of the text, add and remove hyperlinks and insert horizontal lines between the contents

Step 10: Add Second Questioner's Image, Question, Answer and Feedback

Repeat the steps from 5 to 8 to add Second Questioner's Image, Second Question, Second Answer and Second Feedback fields.
After adding all the details, you can see the page as show above.

Step 11: Click the Done Button

Once you've updated all the details, click the Done [1] button shown above to complete editing the page. You can cancel creating the page just by clicking the Remove [2] button shown above. If you click the Done button, you will see the below screen with a preview of the created page.

Step 12: Click the Create Button

If you still want to edit the page, just double click on the preview page, and you will be taken to the Edit page. If you've done all the changes, you can click the Create button as shown above picture to finish editing the page.

You can see the finished page as shown in the above image. You can add as many pages as possible using this component in a Presentation.

Notes

  • You can create as many pages as possible in a Presentation using this component.

  • You can upload thumbnail images in .jpeg, .png and .gif formats only.

  • You can exactly have only 2 questions on a page, and these questions, answers and feedback fields are mandatory.

  • Since the images appear in a circular border, it is advised to add images in 1:1 ratio, i.e., in a square shape.